<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="css/add.css"/>
    <script type="text/javascript" src="js/jquery.1.9.1.js" ></script>
    <script type="text/javascript" src="js/layer.js" ></script>
    <link rel="stylesheet" type="text/css" href="css/layer.css"/>
    <script type="text/javascript" src="js/iScroll.js" ></script>
    <script type="text/javascript" src="js/Mdate.js" ></script>
	<link rel="stylesheet" href="css/Mdate.css" />
	<script type="text/javascript" src="js/mobileSelect.js"></script>
	<link rel="stylesheet" type="text/css" href="css/mobileSelect.css"/>
	<script type="text/javascript" src="js/rem.js" ></script>
    <title>日记账</title>
</head>
<style>
	.session2{display: inline-block;margin-top: 0.1rem;font-size: 0.3rem;}
	.caigou{font-size: 0.3rem;}
	.bitian0{margin-right: 0.2rem;}
	.bitian{margin-top: 0.13rem;}
</style>
<body>
<form id="form2" action="" enctype="multipart/form-data"  method="post">
<ul class="order_money" style="padding: 0 0.3rem;background: #fff;">
    <li>
    		<span class="num fontchange">凭证单号</span>
    		<span class="bitian0">必填</span>
    		<input type="text" class="inputchange" id="num" value="" />
    </li>
    <li>
		<span class="week">开会周次</span><span class="jt"></span>
		<div id="trigger4" class="trigger4" style="display: inline-block;width: 96%;margin-top: 0.1rem;">
		 	<span class="must">必填</span>
		</div>
		 <input type="hidden" name="" id="week" value="" />								
	</li>
    <li>
		<span class="time">日期</span><span class="jt"></span>
		<div id="trigger7" class="trigger7" style="display: inline-block;width: 96%;margin-top: 0.1rem;">
		 	<span class="must">必填</span>
		</div>
		 <input type="hidden" name="" id="datetime" value="" />								
	</li>
	<li>
    		<span class="num fontchange">金额</span>
    		<span class="bitian0">必填</span>
    		<input type="number" class="inputchange" id="money" value="" />
    </li>
    <li>
		<span class="type">收支类型</span><span class="jt"></span>
		<div id="trigger5" class="trigger5" style="display: inline-block;width: 96%;margin-top: 0.1rem;">
		 	<span class="must">必填</span>
		</div>
		 <input type="hidden" name="" id="pay_type" value="" />								
	</li>
	<li class="hide">
		<span class="fee">费用项目</span><span class="jt"></span>
		<div id="trigger6" class="trigger6" style="display: inline-block;width: 96%;margin-top: 0.1rem;">
		 	<span class="must">必填</span>
		</div>
		 <input type="hidden" name="" id="fee" value="" />								
	</li>
	<li style="height: 2.5rem;overflow: hidden;">
		<p class="title fontchange">单据备注</p>
        <textarea class="inputchange beizhu" value="" ></textarea>
    </li>
</ul>
<div class="button">
	<div class="close">删除</div>
	<div class="continue"><input class="pay" type="submit" name="" id="" value="保存" /></div>
</div>
<div class="button">
	<input class="pay" type="submit" name="" id="" value="保存" />
</div>
</form>
<script>//提交表单
$(function(){
	$('.pay').click(function(){
		var num = $('#num').val();
		var week = $('#week').val();
		var datetime = $('#datetime').val();
		var money = $('#money').val();
		var pay_type = $('#pay_type').val();
		var fee = $('#fee').val();
		var beizhu = $('.beizhu').val();
		if(num == ''||num == null){
				layer.open({
				content:'请输入凭证单号' ,
				skin: 'msg',
				time: 2 //2秒后自动关闭
			});
			return false
		}
		if(week == ''||week == null){
				layer.open({
				content:'请选择开会周次' ,
				skin: 'msg',
				time: 2 //2秒后自动关闭
			});
			return false
		}
		if(datetime == ''||datetime == null){
			layer.open({
				content:'请选择单据日期' ,
				skin: 'msg',
				time: 2 //2秒后自动关闭
			});
			return false
		}
		if(money == ''||money == null){
				layer.open({
				content:'请输入金额' ,
				skin: 'msg',
				time: 2 //2秒后自动关闭
			});
			return false
		}
		if(pay_type == ''||pay_type == null){
				layer.open({
				content:'请选择收支类型' ,
				skin: 'msg',
				time: 2 //2秒后自动关闭
			});
			return false
		}
		if(fee == ''||fee == null){
				layer.open({
				content:'请选择费用项目' ,
				skin: 'msg',
				time: 2 //2秒后自动关闭
			});
			return false
		}
		$.ajax({
		  type: 'post',
		  url:"" ,
		  data:{num:num,datetime:datetime,week:week,money:money,pay_type:pay_type,fee:fee,beizhu:beizhu},
		  dataType: "json",
		  success: function(data){
		    window.location.href = "list.html";
		      }
		 });
	 });
});
</script>
<script>
$(function(){
	//先判断input是否有内容
	if($('.inputchange').val() != ''){
		$(this).siblings('.bitian0').hide();
		$(this).siblings('.fontchange').css('font-size','0.2rem');
	}else{
		$(this).siblings('.bitian0').show();
		$(this).siblings('.fontchange').css('font-size','0.32rem');
	}
	//输入时字体变化
	$('.inputchange').keyup(function(){
		if($('.inputchange').val() != ''){
			$(this).siblings('.bitian0').hide();
			$(this).siblings('.fontchange').css('font-size','0.2rem');
		}else{
			$(this).siblings('.bitian0').show();
			$(this).siblings('.fontchange').css('font-size','0.32rem');
		}
	});
});
</script>
<script>
	//周次联动
	var mobileSelect4 = new MobileSelect({
	    trigger: '#trigger4',
	    title: '地区选择',
	    wheels: [{data:[
	    					{
                            id:'1',
                            value:'',
                            childs:[
                                {id:'A1',value:''},
                            ]
                        }
	    			]}],
		 transitionEnd:function(indexArr, data){
		        
		 },
		 callback:function(indexArr, data){
		    $('#week').val(data[1].value);
		    $('.week').css('font-size','0.2rem');
		 }
	});
	var arr = [];
  	$.ajax({
	  url: 'https://oa.fc62.com/api/ajax/year?num=5',
	  type: 'get',
	  success: function (year) {
	  		$.each(year.data,function (index,value) {
	  			 arr[index] = value;
	  			$.get('https://oa.fc62.com/api/ajax/year?year='+value.value,function (week) {
						arr[index]['childs'] = week.data;
					});

		   });
//		   console.log(arr);
		   mobileSelect4.updateWheels(arr);
		   
	  }
	});
	//收支类型
	var mobileSelect5 = new MobileSelect({
	    trigger: '#trigger5',
	    title: '收支类型',
	    wheels: [{data:[
	    					{
                            value:'1',
                            name:'收入'
                        },
                        {
                            value:'2',
                            name:'支出'
                        }
	    			]}],
		 transitionEnd:function(indexArr, data){
		        
		 },
		 callback:function(indexArr, data){
		    $('#pay_type').val(data[0].value);
		    $('.type').css('font-size','0.2rem');
		    if($('#pay_type').val() == 1){
		    		$('.hide').hide();
		    }else{
		    		$('.hide').show();
		    }
		 }
	});
	//费用项目
	var mobileSelect6 = new MobileSelect({
	    trigger: '#trigger6',
	    title: '费用项目',
	    wheels: [{data:[
	    					{
                            id:'1',
                            value:'',
                            childs:[
                                {id:'A1',value:''},
                            ]
                        },
	    			]}],
		 transitionEnd:function(indexArr, data){
		        
		 },
		 callback:function(indexArr, data){
		 	console.log(data)
		    $('#fee').val(data[0].value);
		    $('.fee').css('font-size','0.2rem');
		 }
	});
	$.ajax({
        type: "post",
        url: "https://oa.fc62.com/api/ajax/cost?type=1",
        dataType: "json",
        success: function(res){
            mobileSelect6.updateWheels(res.data);
        }
  	});
  	//日期
	var mobileSelect7 = new MobileSelect({
	    trigger: '#trigger7',
	    title: '日期',
	    wheels: [{data:[
	    					{
                            value:'1',
                            name:'第1天'
                        },
                        {
                            value:'2',
                            name:'第2天'
                        },
                        {
                            value:'3',
                            name:'第3天'
                        },
                        {
                            value:'4',
                            name:'第4天'
                        },
                        {
                            value:'5',
                            name:'第5天'
                        },
                        {
                            value:'6',
                            name:'第6天'
                        },
                        {
                            value:'7',
                            name:'第7天'
                        },
	    			]}],
		 transitionEnd:function(indexArr, data){
		        
		 },
		 callback:function(indexArr, data){
		    $('#datetime').val(data[0].value);
		    $('.time').css('font-size','0.2rem');
		 }
	});
</script>
</body>
</html>
